<template>
    <div>
      <BaseForm
        ref="searchForm"
        type="search"
        :items="formItems"
        v-model:form="searchParams"
        @search="handleSearch"
      >
        <template #suffix-button>
          <el-button type="primary" @click="handleEdit({})">
            <el-icon><Plus /></el-icon>
            添加
          </el-button>
        </template>
      </BaseForm>
  
      <BaseTable
        ref="baseTable"
        :getTableDataFn="basicConfigService.electricPageList"
        :searchParams="searchParams"
        :serial="true"
        :downLoad="basicConfigService.electricDownload"
        :down="true"
        tableName="涉电名词"
      >
        <template #select>
          <el-table-column type="selection" width="55" />
        </template>
        <el-table-column prop="electricWord" label="涉电名称" min-width="200" />
        <el-table-column prop="updateTime" label="最后修改时间" min-width="170">
          <template #header>
            <span>最后修改时间</span>
            <SortTable
              :sortTablekey="sortTablekey"
              @click="sortTablekey = 1"
              :handleSearch="handleSearch"
            ></SortTable>
          </template>
        </el-table-column>
        <el-table-column label="操作" fixed="right" width="100">
          <template #default="scope">
            <el-link
              :underline="false"
              link
              type="primary"
              size="small"
              @click.prevent="handleEdit(scope.row)"
              >编辑</el-link
            >
            <el-link
              :underline="false"
              link
              type="danger"
              size="small"
              @click.prevent="handleDel(scope.row)"
              >删除</el-link
            >
          </template>
        </el-table-column>
      </BaseTable>
      <EditForm
        v-if="visibleEditForm"
        v-model:dialogVisible="visibleEditForm"
        :item="item"
        :handleSearch="handleSearch"
      ></EditForm>
    </div>
  </template>
  
  <script setup lang="ts">
  import EditForm from './EditForm.vue'
  import openMsgBox from '@/hooks/messageBox.js'
  import { basicConfigService } from '@/api/basicConfig'
  
  const formItems = ref([
    {
      name: '涉电名词',
      key: 'electricWord',
      type: 'input',
    },
  ])
  
  const searchParams = ref({})
  const baseTable = ref(null)
  const sortTablekey = ref(1)
  const handleSearch = (data = { sort: undefined }, e = '') => {
    if (e != 'sort') sortTablekey.value = 0
    baseTable.value.handleSearch({
      ...searchParams.value,
      updateTimeOrder: data?.sort,
    })
  }
  const item = ref({})
  const visibleEditForm = ref(false)
  const handleEdit = (row) => {
    item.value = { ...row }
    visibleEditForm.value = true
  }
  const handleDel = (row) => {
    openMsgBox(
      {},
      () => {
        return basicConfigService.electricDelete({ data: row.electricId })
      },
      () => {
        handleSearch()
      }
    )
  }
  onMounted(() => {})
  </script>
  
  <style lang="less" scoped></style>
  